<template>
	<view>
		<view style="height: 180rpx; background-color: white;"></view>
		<view class="fixed">
			<view class="header">
				<view class="btn1" @tap="back">取 消</view>
				<view class="btn2" @tap="clickConfirm">提 交</view>
			</view>
			<view class="header" style="height: 20rpx;border-bottom: 1rpx solid #e7eaea;"></view>
		</view>
		<view style="height: 10rpx;"></view>
		<view class="item">

			<view class="type">
				<view class="text">申请人：</view>
				<input class="input1" type="text" placeholder="请输入申请人真实姓名" v-model="realname">
			</view>

			<view class="type">
				<view class="text">联系电话：</view>
				<input class="input1" type="text" placeholder="请输入联系电话" v-model="mobile">
			</view>

			<view class="type">
				<view class="text">申请金额：</view>
				<input class="input1" type="text" placeholder="请输入申请金额" v-model="money">
			</view>

			<view class="type">
				<view class="text" style="width: 100%;">公司法人的身份证照片（认证时的信息）</view>
				<view class="">
					<view class="text">正面照</view>
					<image :src="src1" mode=""></image>
				</view>
				<view class="">
					<view class="text">反面照</view>
					<image :src="src2" mode=""></image>
				</view>
			</view>

			<view class="type">
				<view class="text" style="width: 100%;">公司的营业执照（认证时的信息）</view>
				<image :src="license" mode=""></image>
			</view>
		</view>
		<view style="height: 50rpx;"></view>
	</view>
</template>

<script>
	// import Region from '@/components/region/region.vue';
	// import uploads from "@/components/uploads.vue";
	export default {
		data() {
			return {
				noClick: true,
				// defaultValue: [],
				realname: '',
				mobile: '',
				money: '',

				src1: '',
				src2: '',
				license: '',
			};
		},

		// components: {
		// 	Region,
		// 	uploads
		// },

		onLoad: function(options) {
			let ID1 = options.ID1;
			let ID2 = options.ID2;
			let license = options.license;
			this.src1 = ID1 && ID1 != 'undefined' ? ID1 : this.src1;
			this.src2 = ID2 && ID2 != 'undefined' ? ID2 : this.src2;
			this.license = license && license != 'undefined' ? license : this.license;
		},

		methods: {

			onChangeRegion(region) {
				let id = 0;
				let area = [];
				this.location = region[0].name + region[1].name;
				if (region[2].id > 0) {
					id = region[2].id;
					area = [region[0].name, region[1].name, region[2].name];
					this.location = this.location + region[2].name;
				} else {
					id = region[1].id;
					area = [region[0].name, region[1].name, ''];
				}
				this.defaultValue = area;
			},

			back() {
				uni.redirectTo({
					url: '/pages8/pages/index/index'
				})
			},

			// 提交表单
			async clickConfirm() {
				//防止连续点击
				let that = this;
				if (that.noClick) {
					that.noClick = false;
					setTimeout(function() {
						that.noClick = true;
					}, 2000)
				} else {
					that.$api.msg("请稍后点击")
					return false;
				}
				//判断是否登录
				let result = that.$api.isLogin();
				if (result === false) {
					return false;
				}

				// if (!that.realname) {
				// 	that.$api.msg('请输入申请人真实姓名！');
				// 	return false;
				// }

				// if (!that.mobile) {
				// 	that.$api.msg('请输入手机号码！');
				// 	return false;
				// }

				// if (!that.money) {
				// 	that.$api.msg('请选择所在位置！');
				// 	return false;
				// }

				let token = uni.getStorageSync('token')
				let dataObj = {
					token: token,
					realname: that.realname,
					mobile: that.mobile,
					money: that.money
				};

				// console.log(dataObj)
				that.submit(dataObj);
			},

			//登录提交
			async submit(dataObj) {
				let res = await this.$myRequest({
					url: '/money_apply',
					data: dataObj,
					methods: 'post'
				})

				let status = res.data.status
				if (status) {
					this.$api.msg(res.data.msg);
					setTimeout(() => {
						uni.navigateTo({
							url: '/pages8/pages/index/index'
						})
					}, 1000)
				}
			},
		},
	}
</script>

<style lang="scss">
	page {
		font-size: 30rpx;
		// padding-right: 5rpx;
	}

	.fixed {
		position: fixed;
		top: 0rpx;
		z-index: 10000;
		width: 100%;
		// margin-top: 30rpx;
		height: 200rpx;
		background-color: white;
	}

	.header {
		display: flex;
		justify-content: space-between;
		position: absolute;
		bottom: 30rpx;
		width: 100%;
		align-items: center;

		.btn1 {
			margin-left: 35rpx;

		}

		.btn2 {
			color: white;
			background-color: #f3511a;
			border-radius: 50rpx;
			padding: 10rpx;
			width: 100rpx;
			text-align: center;
			margin-right: 35rpx;
			margin-bottom: 20rpx;
		}
	}

	.item {
		.type {
			display: flex;
			align-items: flex-start;
			margin-left: 30rpx;
			margin-top: 20rpx;
			flex-wrap: wrap;

			.text {
				letter-spacing: 2rpx;
				font-size: 28upx;
				height: 70rpx;
				line-height: 70rpx;
				width: 22%;
			}

			.input1 {
				background-color: #f5f5f5;
				padding: 20rpx;
				height: 70rpx;
				width: 75%;
				font-size: 28rpx;
			}

			.textarea {
				height: 200rpx;
			}

			.icon {
				width: 30rpx;
				height: 30rpx;
				margin-top: 5rpx;
				margin-right: 10rpx;
				margin-left: 10rpx;
			}

			.btn {
				color: #999999;
				background-color: #f7f7f7;
				text-align: center;
				border-radius: 10rpx;
				margin-left: 20rpx;
				padding: 10rpx;
				margin-top: 10rpx;
				font-size: 28upx;
			}

			.add {
				width: 200rpx;
				height: 200rpx;
			}

			.add-btn {
				display: flex;
				height: 100%;
				width: 80%;
				flex-wrap: wrap;
			}

			.text2 {
				// margin-top: 20rpx;
			}
		}

		.type1 {
			display: flex;
			margin-left: 10rpx;
			// margin-top: 10rpx;
		}

		.typeBottom {
			width: 90%;
			margin: 20rpx auto;
			background-color: #f5f5f5;
			border-radius: 10rpx;
			height: 100rpx;
			display: flex;
			align-items: center;

			.location {
				width: 30rpx;
				height: 36rpx;
				margin: 20rpx;
			}

			.type-didian {
				flex: 1;
			}

			.right {
				width: 14rpx;
				height: 24rpx;
				margin-right: 30rpx;
			}
		}
	}

	.active1,
	.active2,
	.active3 {
		background-color: #3c87fe !important;
		color: #fff !important;
	}
</style>
